/**
 * Created by xinhuang on 15/6/13.
 */
'use strict';
describe('单元测试: slider 指令', function(){
  beforeEach(module('directives.customActivity.realtime'));

  var $rootScope, $compile;
  var scope, element, isolate, panels, tabsli;

  beforeEach(inject(function($injector){
    $rootScope = $injector.get('$rootScope');
    $compile = $injector.get('$compile');

    scope = $rootScope.$new();
    scope.panels = ['upay', 'tmall', 'scpay', 'bank'];

    element = $compile('<slider panels="panels" div-style="height: 200px;"></slider>')(scope);

    angular.element(document.body).append(element);

    scope.$digest();

    isolate = element.isolateScope();

    panels = angular.element(document.getElementsByClassName('dataItem slide'));
    tabsli = angular.element(document.getElementsByClassName('tabsli')).find('li');
  }));

  afterEach(function(){
    angular.element(document.body).html('');
  });

  it('应该正确加载面板, 底部导航数量也正确', function(){
    expect(panels.length).toBe(4);
    expect(panels.eq(0).hasClass('slider-show')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-hide-to-right')).toBeTruthy();
    expect(panels.eq(2).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(3).hasClass('slider-hide')).toBeTruthy();

    expect(tabsli.length).toBe(4);
    expect(tabsli.eq(0).hasClass('active')).toBeTruthy();
  });

  it('点击左导航可以正确切换面板', function(){
    isolate.previous();//3
    isolate.$digest();

    expect(panels.eq(0).hasClass('slider-hide-to-right')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(2).hasClass('slider-hide-to-left')).toBeTruthy();
    expect(panels.eq(3).hasClass('slider-show')).toBeTruthy();

    expect(tabsli.length).toBe(4);
    expect(tabsli.eq(3).hasClass('active')).toBeTruthy();

    isolate.previous();
    isolate.$digest();

    expect(panels.eq(0).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-hide-to-left')).toBeTruthy();
    expect(panels.eq(2).hasClass('slider-show')).toBeTruthy();
    expect(panels.eq(3).hasClass('slider-hide-to-right')).toBeTruthy();

    expect(tabsli.length).toBe(4);
    expect(tabsli.eq(2).hasClass('active')).toBeTruthy();
  });

  it('点击右导航可以正确切换面板', function(){
    isolate.next();//1
    isolate.$digest();

    expect(panels.eq(0).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(0).hasClass('slider-hide-to-left')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-show')).toBeTruthy();
    expect(panels.eq(2).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(2).hasClass('slider-hide-to-right')).toBeTruthy();
    expect(panels.eq(3).hasClass('slider-hide')).toBeTruthy();

    expect(tabsli.length).toBe(4);
    expect(tabsli.eq(1).hasClass('active')).toBeTruthy();

    isolate.next();//2
    isolate.next();//3
    isolate.next();//0
    isolate.$digest();

    expect(panels.eq(0).hasClass('slider-show')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-hide-to-right')).toBeTruthy();
    expect(panels.eq(2).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(3).hasClass('slider-hide')).toBeTruthy();
  });

  it('点击底部导航可以正确切换面板', function(){
    isolate.goto(2);
    isolate.$digest();

    expect(panels.eq(0).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(1).hasClass('slider-hide-to-left')).toBeTruthy();
    expect(panels.eq(2).hasClass('slider-show')).toBeTruthy();
    expect(panels.eq(3).hasClass('slider-hide')).toBeTruthy();
    expect(panels.eq(3).hasClass('slider-hide-to-right')).toBeTruthy();

    expect(tabsli.length).toBe(4);
    expect(tabsli.eq(2).hasClass('active')).toBeTruthy();
  });

  it('当只有一个面板时,不显示左右及底部导航', function(){
    var arrow;

    angular.element(document.body).html('');
    scope.panels = ['upay'];
    element = $compile('<slider panels="panels" div-style="height: 200px;"></slider>')(scope);

    angular.element(document.body).append(element);

    scope.$digest();

    panels = angular.element(document.getElementsByClassName('dataItem slide'));
    arrow = angular.element(document.getElementsByClassName('arrow'));
    tabsli = angular.element(document.getElementsByClassName('tabsli'));

    expect(panels.length).toBe(1);
    expect(panels.eq(0).hasClass('slider-show')).toBeTruthy();

    expect(arrow.eq(0).hasClass('ng-hide')).toBeTruthy();
    expect(arrow.eq(1).hasClass('ng-hide')).toBeTruthy();
    expect(tabsli.eq(0).hasClass('ng-hide')).toBeTruthy();
  });
});